<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        
    </style>
</head>
<body>
    
</body>
<script>


    // 实例
    // ajax("请求A").then((res)=>{
    //     console.log(res);
    //     return ajax("请求B");
    // }).then((res)=>{
    //     console.log(res);
    //     return ajax("请求C");
    // }).then((res)=>{
    //     console.log(res);
    // });

    // then的链式调用，将原本异步的请求，变成同步的

    // 链式调用的原理：
        // then的回调函数的返回值
            // 如果是一个promise实例，这个返回值会被返回到then的执行结果上
            // 如果不是一个promise实例，then会自动创建一个新promise实例，并将这个返回值作为新创建的promise实例的成功状态时的数据，再将这个新promise实例返回到then的执行结果上

    // const p1 = ajax("请求a");
    // const p2 = p1.then(res=>{
    //     console.log(res);
    //     return "hello";
    // })
    // p2.then(res=>{
    //     console.log(res);
    // })
    // console.log(p1);
    // console.log(p2);
    // console.log(p2 === p1);

    // then有两个回调函数，一个处理成功，一个处理失败
    // 失败的回调函数，和成功的回调函数，只有执行时机不同，其他功能完全一致

    // ajax("A").then(res=>{
    //     console.log(res);
    //     return ajax("A成功了之后的B-1");
    // },code=>{
    //     console.log(code);
    //     return ajax("A失败了之后的B-2");
    // }).then(res=>{
    //     console.log(res);
    //     return ajax("B-?成功了之后的C-1");
    // },code=>{
    //     console.log(code);
    //     return ajax("B-?失败了之后的C-2");
    // }).then(res=>{
    //     console.log(res)
    // },code=>{
    //     console.log(code)
    // })

    // =========


    // catch

    // ajax("A").then(res=>{
    //     console.log(res, "then");
    //     return ajax("B");
    // }).catch(code=>{
    //     console.log(code, "catch");
    //     return ajax("C");
    // }).then(res=>{
    //     console.log(res)
    // }).catch(code=>{
    //     console.log(code);
    // })

    // 链式
    // then和catch，都是处理最近的一个promise实例的状态


    // ajax("A").then(res=>{
    //     console.log(res);
    //     return ajax("B");
    // }).then(res=>{
    //     console.log(res);
    //     return ajax("C");
    // }).then(res=>{
    //     console.log(res);
    //     return ajax("D");
    // }).then(res=>{
    //     console.log(res);
    //     return ajax("E");
    // }).then(res=>{
    //     console.log(res);
    // }).catch(code=>{
    //     console.log(code);
    // })




    const p = ajax("A");

    console.log(p)

    // p.then(res=>{
    //     console.log(res)
    // })
    // p.catch(res=>{
    //     console.log(res)
    // })

    // p.finally((res)=>{
    //     console.log(res)
    // })







    function ajax(url){
        return new Promise((resolve, reject)=>{
            // 正在进行时...
            // 开启异步程序
            setTimeout(()=>{
                resolve(url + "请求成功");
            }, Math.random() * 500);

            setTimeout(()=>{
                reject(url + "请求失败");
            }, Math.random() * 500);
        })
    }

    
</script>
</html>